<!doctype html>

<html style="height:100%">
<head>
    <title>可靠性在线工具</title>

    <link rel="stylesheet" href="{{ url_for('static', filename='jquery-ui.css') }}" />
    <script src="{{ url_for('static', filename='jquery-3.3.1.js') }}"></script>
    <script src="{{ url_for('static', filename='jquery-ui.js') }}"></script>

    <style type="text/css">
        body,input,textarea {font-family:Microsoft YaHei; font-size:100%; border-radius:5px;}
        textarea {width:98%; height:100%; resize:none;}
        table {table-layout:fixed; }

        .ui-tabs-vertical { width: 100%; height:100%; }
        .ui-tabs-vertical .ui-tabs-nav { float: left; width: 20%; }
        .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
        .ui-tabs-vertical .ui-tabs-nav li a { display:block; }
        .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
        .ui-tabs-vertical .ui-tabs-panel { float: right; width: 75%; text-align:left; }
    </style>
</head>

<body style="margin:0; width:100%; height:100%; text-aglin:center; aglin:center;">

    <!-- 标题 -->
    <div align=center style="width:100%; height:50px; background:#003399; ">
        <table border=0 style="width:90%; height:100%; ">
            <tr>
                <td style="width:50%; text-align:left; border:0px solid; ">
                    <a href="/" style="color:white; text-decoration:none; font-size:150%; ">可靠性在线工具</a>

                    <a href="/" style="padding-left:30px; color:red; text-decoration:none; " title='Beta APR分析备注/报告'>Beta APR</a>
                    <a href="/" style="padding-left:30px; color:white; text-decoration:none; ">Beta问题/FUT</a>
                    <a href="/" style="padding-left:30px; color:white; text-decoration:none; ">舆情/满意度</a>
                </td>
                
                <td style="text-align:right; color:white;">
{% if username %}
                    Hello {{ username }}! <input type=submit value="登出" onclick="location='/logout'"/>
{% else %}
                    <form action="/login" method="post" onsubmit="return checkLoginW3();">
                        <label>账号：</label>
                        <input type=text id=w3name name=w3name id=w3name/>
                        <label>密码：</label>
                        <input type=password id=w3pwd name=w3pwd id=w3pwd/>
                        <input type=submit value="登陆W3"/>
                    </form>
{% endif %}
                </th>
            </tr>
        </table>
    </div>

    <!-- 正文 -->
    <div style="width:90%; height:100%; margin:0 auto; text-align:center;">

        <div id="tabs" style="width:100%; height:100%; padding-top:20px; border:0px solid; ">
            <ul>
                <li>Beta APR分析备注</li>
                <li><a href="#tabs-1-1">自动分析备注</a></li>
                <li><a href="#tabs-1-2">查询分析情况</a></li>
                <li><a href="#tabs-1-3">指定SN历史情况</a></li>
                <li><a href="#tabs-1-4">指定类型历史情况</a></li>
                <li><a href="#tabs-1-5">获取整好的报告</a></li>
            </ul>

            <div id="input-1" style="">
                产品：<input type=text id=product title="示例：ALP-AL00">
                版本：<input type=text id=version title="示例：ALP-AL00 9.0.0.108">
                <br>
                问题类型ID：<input type=text id=eventtype title="示例：901000002,901000003">
                SN/关键字：<input type=text id=sn title="示例：audio">
            </div>
            <div id="input-2">
            </div>
            <div id="input-3">
            </div>

            <div id="tabs-1-1" style="height:100%; ">
                <h2>Beta APR自动分析备注</h2>

                输入：指定一个Beta APR版本，例如ALP-AL00 9.0.0.181(C00)
                <br>
                输出：（在APR网站体现，需要时间）
                <br>
                <br>

                <button onclick="submitVersionAnalyse()">提交</button>
                
                <textarea></textarea>
            </div>

            <div id="tabs-1-2">
            <h2>查询Beta APR分析情况</h2>
                输入：指定一个Beta APR版本，例如ALP-AL00 9.0.0.181(C00)
                <br>
                输出：一份数量统计报告，涵盖所有问题
                <br>
                <br>

                <button onclick="submitVersionAnalyse()">提交</button>
            </div>

            <div id="tabs-1-3">
                <h2>指定SN历史版本情况</h2>

                输入：指定产品 + SN，例如ALP-AL00 + ABCDEFG
                <br>
                输出：一份数量统计报告，涵盖所有版本
                <br>
                <br>

                <button onclick="submitVersionAnalyse()">提交</button>
            </div>

            <div id="tabs-1-4">
                <h2>指定问题历史版本情况</h2>

                输入：指定产品 + 问题类型，例如ALP-AL00 + Boot Fail
                <br>
                输出：一份数量统计报告，涵盖所有版本
                <br>
                <br>

                <button onclick="submitVersionAnalyse()">提交</button>
            </div>

            <div id="tabs-1-5">
                <h2>获取整好的APR报告</h2>

                输入：指定一个Beta APR版本，例如ALP-AL00 9.0.0.181(C00)
                <br>
                输出：一份APR指标报告，带有问题分析明细，多少数量是什么DTS|结论
                <br>
                <br>

                <button onclick="submitVersionAnalyse()">提交</button>
            </div>
        </div>
    </div>
</body>

<script type="text/javascript">
    <!-- 标签页 -->
    $( "#tabs" ).tabs().addClass( "ui-tabs-vertical ui-helper-clearfix" );
    $( "#tabs li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );

    <!-- 提示框 -->
    $( document ).tooltip();

    <!-- 按钮 -->
    $( "input[type=submit], button" )
    .button()
    <!-- .click(function( event ) { -->
    <!-- event.preventDefault(); -->
    <!-- }); -->
</script>
</html>